﻿<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>CodeBox - 前端代码收集</TITLE>
<META http-equiv=content-type content="text/html; charset=UTF-8">
<META content=风之石(dh20156),梅雪香(Meixx) name=author>
<META content=jslib,javascript,css,dhtml,web,前端,专家,developer,library,代码库 
name=keywords>
<META 
content=这里存储着web前端dhtml精英俱乐部web前端专家收集共享的兼容性强,功能强大或者技巧性的javascript脚本和css样式代码,可以给web开发者提供技术支持和指南. 
name=description><LINK media=all href="JSLab.files/v.css" type=text/css 
rel=stylesheet><LINK href="JSLab.files/dhtabstrip.css" type=text/css 
rel=stylesheet>
<STYLE type=text/css> {
	FONT-SIZE: 12px
}
.article {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px
}
#dltList {
	DISPLAY: inline; MARGIN-BOTTOM: -15px; WIDTH: 200px; HEIGHT: 500px
}
#divMother {
	DISPLAY: none
}
#divNewMother {
	DISPLAY: none
}
FIELDSET {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px
}
LABEL {
	DISPLAY: inline-block; WIDTH: 60px
}
#nameid {
	WIDTH: 260px
}
#authorid {
	WIDTH: 260px
}
#dateid {
	WIDTH: 260px
}
#commonid {
	WIDTH: 260px
}
</STYLE>

<META content="MSHTML 6.00.2900.6036" name=GENERATOR></HEAD>
<BODY>

<DIV class=page>
<UL class=crumbs>
  <LI>JSLab JavaScript和Css代码实验室，精华代码库！ </LI></UL>
<DIV class=article>
<TABLE width="100%">
  <TBODY>
  <TR>
    <TD vAlign=top width=200><SELECT id=dltList 
        size=2><OPTION>正在加载xml文件...</OPTION></SELECT><BR><INPUT 
      onkeypress=keyPress(event) id=txtKeyword style="WIDTH: 150px"><BUTTON 
      style="WIDTH: 50px" onclick=find()>Find</BUTTON><BR><BUTTON 
      style="WIDTH: 200px" onclick=newCode()>Add New Code</BUTTON> </TD>
    <TD id=showcode vAlign=top></TD></TR>
  <TR>
    <TD colSpan=2><A style="COLOR: black" 
      href="data/favorate.xml" target=_blank>JavaScript and 
      Css code library XML文件下载</A><BR><A style="COLOR: black" 
      href="http://www.jslab.org.cn/meixx.htm" target=_blank>JavaScript and Css 
      code library单机版HTM文件下载</A></TD></TR></TBODY></TABLE>
<DIV id=divMother>
<FIELDSET><LEGEND>details</LEGEND><LABEL>name:</LABEL><INPUT id=nameid>&nbsp; 
<LABEL>author:</LABEL><INPUT id=authorid>&nbsp;<BR><LABEL>date:</LABEL><INPUT 
id=dateid>&nbsp; <LABEL>comment:</LABEL><INPUT id=commonid> </FIELDSET> 
<FIELDSET><LEGEND>code</LEGEND><TEXTAREA id=ta style="WIDTH: 100%; HEIGHT: 330px"></TEXTAREA> 
</FIELDSET> </DIV>
<DIV id=divNewMother>
<FIELDSET><LEGEND>details</LEGEND><LABEL>name:</LABEL><INPUT id=nameid 
title=代码名称:仅允许输入英文字母!>&nbsp; <LABEL>author:</LABEL><INPUT 
id=authorid>&nbsp;<BR><LABEL>date:</LABEL><INPUT id=dateid>&nbsp; 
<LABEL>comment:</LABEL><INPUT id=commonid> </FIELDSET> 
<FIELDSET><LEGEND>code</LEGEND><TEXTAREA id=ta style="WIDTH: 100%; HEIGHT: 330px"></TEXTAREA> 
</FIELDSET> </DIV></DIV>

</DIV>

<SCRIPT src="JSLab.files/dhtabstrip.js" type=text/javascript></SCRIPT>

<SCRIPT type=text/javascript>
var easyUI={ajax:{tryList:function(){var xhr=null;for(var i=0;i<arguments.length;i++){var lambda=arguments[i];try{xhr=lambda();}catch(e){}if(xhr){break;}}return xhr;},init:function(){return this.tryList(function(){try{return new ActiveXObject('MSXML2.XMLHttp.6.0');}catch(e){}},function(){try{return new ActiveXObject('MSXML2.XMLHttp.3.0');}catch(e){}},function(){try{return new XMLHttpRequest();}catch(e){}},function(){try{return new ActiveXObject('MSXML2.XMLHttp.5.0');}catch(e){}},function(){try{return new ActiveXObject('MSXML2.XMLHttp.4.0');}catch(e){}},function(){try{return new ActiveXObject('Msxml2.XMLHTTP');}catch(e){}},function(){try{return new ActiveXObject('MSXML.XMLHttp');}catch(e){}},function(){try{return new ActiveXObject('Microsoft.XMLHTTP');}catch(e){}})||null;},post:function(sUrl,sArgs,bAsync,fCallBack,fFailure){var xhr=this.init();if(!xhr){alert('XmlHttp对象未就绪！');return;}xhr.onreadystatechange=function(){if(xhr.readyState==4){if(xhr.status==200){if(fCallBack&&fCallBack.constructor==Function){fCallBack(xhr);}}else{if(fFailure&&fFailure.constructor==Function){fFailure(xhr);}else{alert('服务器错误：'+xhr.status);}xhr=null;}}};xhr.open('POST',encodeURI(sUrl),bAsync);xhr.setRequestHeader('Content-Length',sArgs.length);xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');xhr.send(sArgs);},get:function(sUrl,bAsync,fCallBack,fFailure){var xhr=this.init();if(!xhr){alert('XmlHttp对象未就绪！');return;}xhr.onreadystatechange=function(){if(xhr.readyState==4){if(xhr.status==200){if(fCallBack&&fCallBack.constructor==Function){fCallBack(xhr);}}else{if(fFailure&&fFailure.constructor==Function){fFailure(xhr);}else{alert('服务器错误：'+xhr.status);}xhr=null;}}};xhr.open('GET',encodeURI(sUrl),bAsync);xhr.send('Null');},xRequest:function(id,url){oScript=document.getElementById(id);var head=document.getElementsByTagName("head").item(0);if(oScript){head.removeChild(oScript);}oScript=document.createElement("script");oScript.setAttribute("src",url);oScript.setAttribute("id",id);oScript.setAttribute("type","text/javascript");oScript.setAttribute("language","javascript");head.appendChild(oScript);return oScript;}},getArgs:function(){var sarg=document.location.search.substr(1),rv={};rv.filename=document.location.pathname.replace(/.*\//ig,'');if(!sarg){return rv;}var aarg=sarg.split('&'),atmp=[];for(var i=0;i<aarg.length;i++){atmp=aarg[i].split('=');rv[atmp[0]]=atmp[1];}return rv;}};
var sargs = easyUI.getArgs(),rtag = (sargs['tag'])?new RegExp('\\b'+sargs['tag']+'\\b','i'):null,rpage = sargs['page'];
var ea = function(){
    var ret = Array.prototype.slice.call(arguments,0);
    ret.o = {};
    ret.save = function(str){
        if(!this.o[str]){
            this.o[str] = 1;
            this.push(str);
        }
    };
    return ret;
};
var oea = new ea();
var Browser={};
Browser.isMozilla = (typeof document.implementation != 'undefined') && (typeof document.implementation.createDocument != 'undefined') && (typeof HTMLDocument!='undefined');
Browser.isIE = window.ActiveXObject ? true : false;
Browser.isFirefox = (navigator.userAgent.toLowerCase().indexOf("firefox")!=-1);
window.root = null;
window.onload = winload;
window.onunload = function(){window.root = null;oea.o = null;oea.length = 0;};
function winload(){
    window.root = null;
    oea.o = {};
    oea.length = 0;
    var path = "data/favorate.xml?temp="+Math.random();
    var dltList = document.getElementById("dltList");
    var init = function(xhr){
        var root = xhr.responseXML.documentElement;
	if(root!=null){
		window.root = root;
		document.body.scrollTop = 95;
        	dltList.options.length =0;
        	var nodes = root.childNodes,nnn = '';
        	for(i=0;i<nodes.length;i++){
			nnn = nodes[i].nodeName;
            		if(nnn != "#text" && nnn != "#comment" && !oea.o[nnn]){oea.save(nnn);}
        	}
		oea.sort(function(a,b){return a.toLowerCase().localeCompare(b.toLowerCase())});
		var l = oea.length,p='';
		dltList.style.display = 'none';
		for(var i=dltList.options.length-1;i>-1;i--){
			dltList.remove(i);
		}
        	for(i=0;i<l;i++){
			p = oea[i];
            		var opt = document.createElement("option");
            		dltList.options.add(opt);
            		opt.value = p;
            		opt.text = p;
			if(rtag&&rtag.test(p)){opt.selected = 'selected';showDetail(dltList,rpage);}
        	}
		dltList.style.display = 'block';
        	if(!rtag){dltList.selectedIndex = -1;}
        	dltList.onchange = function(){ showDetail(this) };
        	dltList.ondblclick = function(){ showDetail(this) };
	}
    };
    easyUI.ajax.get(path,true,init);
}

function find(){
    var dltList = document.getElementById("dltList");
    var txtKeyword = document.getElementById("txtKeyword");
    var key = txtKeyword.value;
    var idx = dltList.selectedIndex;
    for(var k = 0,j=dltList.options.length,i = ((idx+1)>=j)?0:(idx+1);;i++,k++){
        if(i >= j) i=0;
        if(k >= j) return;
        var opt = dltList.options[i];
        var reg = new RegExp(key,"i");
        if(reg.test(opt.value)){
            dltList.selectedIndex = i;
            showDetail(dltList)
            return;
        }
    }
}

function keyPress(e){if(e.keyCode == 13 || e.charCode == 13){find();}}
String.prototype.trim=function(){return this.replace(/(^\s+)|(\s+$)/g,"");}

function showTag(stag){
	var txtKeyword = document.getElementById("txtKeyword");
	txtKeyword.value = stag;
	find();	
}

function showDetail(dlt,pid){
	var divMother = document.getElementById("divMother");
	var idx = dlt.selectedIndex;
	if(idx>=0){
		try{dt.removeAll();}catch(e){}
		var key = dlt.options[idx].value;
		var nodes = root.getElementsByTagName(key);
		for(var i=0,j=nodes.length;i<j;i++){
			var n = nodes[i];
			var d = divMother.cloneNode(true);
			d.style.display = "block";
			d.getElementsByTagName("input")[0].value = key;
			d.getElementsByTagName("input")[1].value = n.getAttribute("author");
			d.getElementsByTagName("input")[2].value = n.getAttribute("date");
			d.getElementsByTagName("input")[3].value = n.getAttribute("common");
			d.getElementsByTagName("textarea")[0].value = n.childNodes[0].nodeValue.trim();
			try{dt.addTab(key,d);}catch(e){}
		}
		pid = isNaN(pid)?0:(pid>=1&&pid<=j)?(pid-1):0;
		dt.showTab(pid);
		document.getElementById("savecodebtn").style.display = "none";
	}
}
function runCode(){
	try{
		var code = dt.getCurrentNode().tc.getElementsByTagName("textarea")[0].value;
		var pwin = window.open();
		pwin.document.write(code);
		pwin.document.close();
	}catch(e){}
}
function copyCode(){
	try{
		var ta = dt.getCurrentNode().tc.getElementsByTagName("textarea")[0];
		ta.focus();
		ta.select();
		if(Browser.isIE){window.clipboardData.setData("text",ta.value);}
	}catch(e){}
}
function newCode(){
	try{
		dt.removeAll();
		dt.addTab("JSLab Lib",document.getElementById("divNewMother").innerHTML);
	}catch(e){}
	document.getElementById("savecodebtn").style.display = "inline";
}
function saveCode(){
	try{
		var nowtab = dt.getCurrentNode().tc;
		var namev = nowtab.getElementsByTagName("input")[0].value;
		namev = namev.replace(/,|\s/g,"");
		var authorv = nowtab.getElementsByTagName("input")[1].value;
		var datev = nowtab.getElementsByTagName("input")[2].value;
		var commonv = nowtab.getElementsByTagName("input")[3].value;
		var codev = nowtab.getElementsByTagName("textarea")[0].value;
		codev = codev.replace(/\+/g,'＋').replace(/\%/g,'％');
		if(namev.replace(/ /g,"").length<1){
			alert('The field "name" can not be empty!');
			nowtab.getElementsByTagName("input")[0].focus();
		}else if(/[^a-z0-9]/i.test(namev)){
			alert('The field "name" only accept the characters [a-zA-Z0-9]!');
			nowtab.getElementsByTagName("input")[0].focus();
		}else if(codev.replace(/\r\n|\s/g,"").length<1){
			alert('The field "code" can not be empty!');
			nowtab.getElementsByTagName("textarea")[0].focus();
		}else{
			var url = "savecode.asp";
			var args = "codename="+escape(namev)+"&author="+escape(authorv)+"&date="+escape(datev)+"&common="+escape(commonv)+"&code="+escape(codev);
			//alert(args);
			postmsg(url,args);
		}
		nowtab = null;
	}catch(e){}
}

function clearmsg(obj,n){
	window.setTimeout(function(){obj.innerHTML=''},n);
}

function showpostmsg(xhr){
	var obj = document.getElementById("sendmsgbox");
	var str = unescape(xhr.responseText);
	obj.innerHTML = str;
	if(str=="Data storage finished!"){winload();}
	clearmsg(obj,5000);
}

function postmsg(url,args){
	document.getElementById("sendmsgbox").innerHTML = "Data processing, please wait......";
	easyUI.ajax.post(url, args, true, showpostmsg)
}
var isMSIE = (navigator.appName == "Microsoft Internet Explorer");
var dt = new dhtabStrip();
dt.rid = "dhtabstrip";
dt.width = 748;
dt.height = 530;
dt.tabwidth = 100;
dt.init(document.getElementById("showcode"));
dt.addTab("JavaScript and Css code library",document.getElementById("divNewMother").innerHTML);
dt.setButton('<span id="sendmsgbox" style="margin-right:5px;color:red;font-size:12px;"></span><button style="width:80px;font-size:12px;" onclick="runCode();">运行代码</button>&nbsp;<button style="width:80px;font-size:12px;" onclick="copyCode();">复制代码</button>&nbsp;<button id="savecodebtn" style="width:80px;font-size:12px;" onclick="saveCode();">保存代码</button>');
</SCRIPT>

<SCRIPT src="JSLab.files/urchin.js" type=text/javascript>
</SCRIPT>

<SCRIPT type=text/javascript>
_uacct = "UA-3422792-1";
urchinTracker();
</SCRIPT>
</BODY></HTML>
